<template>

	<view class="main">
		<image class="ysaimg" style="width: 100%;height: 100vh;position: fixed;top: 0;" src="/static/images/ysxq.png"></image>

		<u-navbar :bgColor="bgColor" :fixed="false" title="患者详情" placeholder="true" :autoBack="true"></u-navbar>


		<view class="ysjs row_a_c">

			<!-- <image class="tx" src="/static/images/home.png"></image> -->
			<image class="tx" :src="InfosData.avatar"></image>
			<view class="column">
				<view class="phone">{{InfosData.name}}</view>
				<view class="zhiwu ">电话：{{InfosData.phone}}</view>
				<view class="zhiwu ">病历号：{{InfosData.id}}</view>
			</view>

		</view>

		<view class="infot">

			<view class=" space-between" style="margin-bottom: 20rpx;">

				<view class="infowz" @click="sendSms(InfosData.phone)">
					<view class="row_a_c">
						<image class="yyjl" src="/static/images/dx.png"></image>
						<view class="yyjlwz">发送短信</view>
					</view>
					<view class="row_a_c" style="margin-top: 20rpx;margin-left: 10rpx;">
						<view class="bjzyxx">给患者发送信息</view>
						<view class="bjzyxxb"> > </view>
					</view>
				</view>

				<view class="infowz" @click="makeCall(InfosData.phone)">
					<view class="row_a_c">
						<image class="yyjl" src="/static/images/lxx.png"></image>
						<view class="yyjlwz">联系患者</view>
					</view>
					<view class="row_a_c" style="margin-top: 20rpx;margin-left: 10rpx;">
						<view class="bjzyxx">给患者拨打电话</view>
						<view class="bjzyxxb"> > </view>
					</view>
				</view>

			</view>


			<view class="itemall row space-between">

				<view class="column">

					<view class="column_c" @click="toUrlInfo(InfosData.id)">
						<image class="yyjl" src="/static/images/yyjl.png"></image>
						<view class="yyjlwz">详细资料</view>
					</view>

					<view class="column_c itemc" @click="toUrlJzjl(InfosData.id)">
						<image class="yyjl" src="/static/images/jzjl.png"></image>
						<view class="yyjlwz">就诊记录</view>
					</view>
				</view>


				<view class="column">
					<view class="column_c" @click="toUrlYyjl(InfosData.id)">
						<image class="yyjl" src="/static/images/yyjl2.png"></image>
						<view class="yyjlwz">预约记录</view>
					</view>

					<view class="column_c itemc" @click="toUrlYxjl(InfosData.id)">
						<image class="yyjl" src="/static/images/yiyjl.png"></image>
						<view class="yyjlwz">影像记录</view>
					</view>
				</view>


				<view class="column">
					<view class="column_c" @click="toUrlSfjl(InfosData.id)">
						<image class="yyjl" src="/static/images/sfjh.png"></image>
						<view class="yyjlwz">随访记录</view>
					</view>

					<view class="column_c itemc" @click="toUrlSssfjl(InfosData.id)">
						<image class="yyjl" src="/static/images/sfjl2.png"></image>
						<view class="yyjlwz">收费记录</view>
					</view>
				</view>


				<view class="column_c" @click="toUrlBljl(InfosData.id)">
					<image class="yyjl" src="/static/images/bljl.png"></image>
					<view class="yyjlwz">病历记录</view>
				</view>

			</view>

			<view class="card">
				<!-- 标题栏 -->
				<view class="header">
					<view class="row_a_c">
						<view class="xiaoxx"></view>
						<view class="header-title">上次就诊信息</view>
					</view>

					<text class="header-status">{{LastVisitInfoData.territory.name}}</text>
				</view>
				<!-- 内容区域 -->
				<view class="content">
					<view class="info-row">
						<text class="label">主治医生：</text>
						<text class="value">{{LastVisitInfoData.doctor.name}}</text>
					</view>
					<view class="info-row">
						<text class="label">就诊门店：</text>
						<text class="value">{{LastVisitInfoData.store.name}}</text>
					</view>
					<view class="info-row">
						<text class="label">就诊时间：</text>
						<text class="value">{{LastVisitInfoData.arrival_at}}</text>
					</view>
				</view>
			</view>

		</view>




	</view>

</template>

<script>
	import api_patient from '@/api/patient.js';

	export default {

		async onLoad(option) {
			this.user = option.id;
		},

		async onShow() {
			this.access_token = uni.getStorageSync('access_token');
			if (!this.access_token) {
				uni.navigateTo({
					url: '/pages/auth/login'
				});
			} else {
				this.getUserInfoFuc(); //获取患者信息
				this.getUserLastVisitInfoFuc(); //上次就诊信息
			}
		},

		data() {
			return {
				user: null,
				access_token: null,
				userInfo: null,
				bgColor: 'rgba(0, 31, 63, 0)',
				phone: null,
				InfosData: null,
				LastVisitInfoData: null,
			};
		},
		methods: {
			toUrl(url) {
				this.navTo(url);
			},

			//发送短信
			sendSms(phone) {
				const phoneNumber = phone; // 手机号
				const message = '你好，这是测试短信内容'; // 短信内容

				// 判断当前平台
				if (typeof plus !== 'undefined') {
					// App 平台调用原生短信应用
					const smsUrl = `sms:${phoneNumber}?body=${encodeURIComponent(message)}`;
					plus.runtime.openURL(smsUrl, (err) => {
						console.error('短信应用打开失败', err);
					});
				} else if (process.env.UNI_PLATFORM === 'mp-weixin') {
					// 微信小程序环境
					uni.showToast({
						title: '小程序不支持发送短信，请查看患者手机号，编辑短信发送',
						icon: 'none',
					});
				} else if (process.env.UNI_PLATFORM === 'h5') {
					// H5 环境
					uni.showToast({
						title: 'H5 暂不支持发送短信',
						icon: 'none',
					});
				} else {
					uni.showToast({
						title: '当前平台不支持发送短信',
						icon: 'none',
					});
				}
			},


			//打电话
			makeCall(phoneNumber) {
				uni.makePhoneCall({
					phoneNumber: phoneNumber, // 需要拨打的电话号码
					success: () => {
						console.log('拨打成功');
					},
					fail: (err) => {
						console.log('拨打失败', err);
					},
				});
			},

			//预约记录
			toUrlYyjl(id) {
				uni.navigateTo({
					url: '/pages/patient/appointment-record?id=' + id
				});
			},

			//就诊记录
			toUrlJzjl(id) {
				uni.navigateTo({
					url: '/pages/patient/jzjl?id=' + id
				});
			},


			//影像记录
			toUrlYxjl(id) {
				uni.navigateTo({
					url: '/pages/patient/video-recording?id=' + id
				});
			},

			//随访记录
			toUrlSfjl(id) {
				uni.navigateTo({
					url: '/pages/patient/follow-record?id=' + id
				});
			},

			//收费记录
			toUrlSssfjl(id) {
				uni.navigateTo({
					url: '/pages/patient/sfjl?id=' + id
				});
			},

			//病历记录
			toUrlBljl(id) {
				uni.navigateTo({
					url: '/pages/patient/bljl?id=' + id
				});
			},

			//详细资料
			toUrlInfo(id) {
				uni.navigateTo({
					url: '/pages/patient/information?id=' + id
				});
			},

			//获取患者信息
			async getUserInfoFuc() {
				var per = {
					user: this.user
				}
				const res = await api_patient.getUserInfo(per);
				if (res.code == 1) {
					this.InfosData = res.data.info
				} else {
					this.$util.msg(res.message);
					return;
				}
			},

			//上次就诊信息
			async getUserLastVisitInfoFuc() {
				var per = {
					user: this.user
				}
				const res = await api_patient.getUserLastVisitInfo(per);
				if (res.code == 1) {
					this.LastVisitInfoData = res.data.info
				} else {
					this.$util.msg(res.message);
					return;
				}
			},


		}
	};
</script>

<style scoped lang="scss">
	.ysjs {
		position: absolute;
		top: 250rpx;
		left: 62rpx;
	}

	.name {
		font-weight: 400;
		font-size: 40rpx;
		color: #3D3D3D;
	}


	.tx {
		width: 128rpx;
		height: 128rpx;
		border-radius: 200rpx;
		margin-right: 34rpx;
	}

	.phone {
		font-weight: 400;
		font-size: 40rpx;
		color: #3D3D3D;
		line-height: 56rpx;
		font-style: normal;
		text-transform: none;
	}

	.zhiwu {
		font-weight: 400;
		font-size: 24rpx;
		color: #1FA194;
		line-height: 40rpx;
		margin-top: 10rpx;
	}


	.infot {
		position: absolute;
		top: 440rpx;
		left: 32rpx;
		width: 686rpx;
	}

	.title {
		font-weight: 800;
		font-size: 28rpx;
		color: #3D3D3D;
	}

	.infowz {
		width: 335rpx;
		height: 160rpx;
		background: #FFFFFF;
		border-radius: 12rpx 12rpx 12rpx 12rpx;
		padding: 32rpx;
	}

	.bjzyxx {
		font-weight: 400;
		font-size: 20rpx;
		color: rgba(0, 0, 0, 0.4);
		margin-right: 20rpx;
	}

	.bjzyxxb {
		font-weight: 400;
		font-size: 25rpx;
		color: rgba(0, 0, 0, 0.4);
	}


	.itemall {
		width: 686rpx;
		height: 350rpx;
		background: #FFFFFF;
		border-radius: 12rpx 12rpx 12rpx 12rpx;
		padding: 48rpx 32rpx;
	}

	.yyjl {
		width: 64rpx;
		height: 64rpx;
	}

	.yyjlwz {
		font-weight: 400;
		font-size: 24rpx;
		color: rgba(0, 0, 0, 0.85);
	}

	.card {
		background-color: #ffffff;
		border-radius: 12rpx;
		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
		padding: 32rpx;
		margin-top: 20rpx;
	}

	.header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1rpx solid #e6e6e6;
		padding-bottom: 10rpx;
		margin-bottom: 15rpx;
	}

	.header-title {
		font-size: 30rpx;
		font-weight: bold;
		color: #333333;
	}

	.header-status {
		font-size: 28rpx;
		color: #37C1A6;
		/* 状态颜色 */
	}

	.content {
		display: flex;
		flex-direction: column;
		gap: 10rpx;
		/* 行间距 */
	}

	.info-row {
		display: flex;
		align-items: center;
	}

	.label {
		font-size: 28rpx;
		color: #666666;
		width: 180rpx;
		/* 标签宽度，确保对齐 */
	}

	.value {
		font-size: 28rpx;
		color: #333333;
		flex: 1;
	}

	.xiaoxx {
		margin-right: 15rpx;
		width: 8rpx;
		height: 32rpx;
		background: linear-gradient(180deg, #EBF6F6 0%, #27CCBB 100%);
		border-radius: 8rpx 8rpx 8rpx 8rpx;
	}
</style>